<template>
  <div>
    <!-- 普通插值表达式 -->
    <div>{{ msg }}</div>
    <!-- 直接输出纯文本,指令的内容高于标签体的内容 -->
    <div v-text="msg">{{ msg2 }}</div>
    <!-- 填充html代码 -->
    <div v-html="msg2"></div>
    <!-- 输出不经过编译的内容，相当于xml中的CDATA -->
    <div v-pre>{{ msg2 }}</div>
  </div>
</template>

<script>
export default {
  name: "TestVPre",
  data() {
    return {
      msg: 'cyd',
      msg2: '<h1>cyd</h1>'
    }
  }
}
</script>

<style scoped>

</style>